<template>
    <div class="dashboard-container">
        <my-table v-loading="loading" ref="myEltable" style="width: 100%" row-key="id" :showsummary="false" :columns="tableColumns" :tableData="tableDatas" :pageNum="queryObj.pageNo" :pageSize="queryObj.pageSize" :totalPage="total" :height="$store.state.app.windowHeight - 200" max-height="660px" :current="false" @onCurrentChange="changepageNo" @onPageSizeChange="changePageSize" highlight-current-row :ifSelect="false" @onSelectionChange="onSelectionChange" />
        <div style="text-align:center;">
            <el-button type="primary" size="mini" @click="go('list')">返回</el-button>
        </div>
    </div>
</template>

<script>

import { queryExeRecordByBatchId, download_report } from '@/api/znjk/znjk'
import { downloadFile } from "@/utils/utils"
export default {
    name: 'zznjk-zxjl',
    props: {
        rowData: {
            type: Object,
            default: false
        }

    },
    data() {
        return {
            loading: false,

            //右侧表格开始
            tableColumns: [
                {
                    label: '开始时间',
                    prop: 'startTime',
                    align: 'center',
                    minWidth: 120,
                },
                {
                    label: '结束时间',
                    prop: 'endTime',
                    align: 'center',
                    minWidth: 120,
                }, {
                    label: '执行结果',
                    prop: 'exeResult',
                    align: 'center',
                    minWidth: 80,
                    render: (h, params) => {
                        //     // onClick={() => this.upload(params.row)}
                        //     if (params.row.exeResult > '09') {
                        //         return (
                        //             <span class="undertxtRed" onClick={() => this.go('result', params.row)}>
                        //                 失败
                        //             </span>
                        //         );
                        //     } else if (params.row.last_status == '00') {
                        //         return (<span class="undertxtBlue" onClick={() => this.go('result', params.row)}>
                        //             成功
                        //         </span>
                        //         )
                        //     }
                        return (
                            <span class="undertxtBlue" onClick={() => this.downFile(params.row)}>
                                {params.row.exeResult}
                            </span>
                        );
                    }
                }
            ],
            tableDatas: [],
            total: 0,
            selectedRows: [],
            queryObj: {
                zbmc: '', //指标名称
                rwmc: '',//指标类型
                pageNo: 1,
                pageSize: 20
            },


        }
    },

    mounted() {

        console.log(this.rowData)
        this.getTableData()
    },
    methods: {
        downFile(row) {
            this.loading = true
            download_report({ batchId: row.taskBatchId }).then(res => {
                console.log(res)
                this.loading = false

                const blob = new Blob([res], {
                    type: "application/msword"
                });
                const elink = document.createElement("a");
                elink.download = localStorage.getItem('jmFileName')||'智能监控报告_'+row.taskBatchId+'.docx';
                elink.style.display = "none";
                elink.href = URL.createObjectURL(blob);
                document.body.appendChild(elink);
                elink.click();
                URL.revokeObjectURL(elink.href); // 释放URL 对象
                document.body.removeChild(elink);
            })
        },
        searchForm(params) {
            console.log(params, '查询条件');
            this.queryObj.zbmc = params.zbmc || '';
            this.queryObj.rwmc = params.rwmc || '';
            this.getTableData();
        },
        resetForm() {
            for (let key in this.queryObj) {
                if (key == 'pageNo') {
                    this.queryObj[key] = 1;
                } else if (key == 'pageSize') {
                    this.queryObj[key] = 20;
                } else {
                    this.queryObj[key] = '';
                }
            }
            this.getTableData();
        },


        getTableData() {
            this.loading = true;
            let params = {
                task_id: this.rowData.task_id,
                pageNum: this.queryObj.pageNo,
                pageSize: this.queryObj.pageSize,
            }
            queryExeRecordByBatchId(params).then(res => {
                console.log(res)
                this.loading = false;
                if (res.code == 200) {
                    this.tableDatas = res.data.records
                    this.total = res.data.total
                }
            })
        },
        changepageNo(currPage) {
            this.queryObj.pageNo = currPage;
            this.getTableData();
        },
        changePageSize(pageSize) {
            this.queryObj.pageSize = pageSize;
            this.getTableData();
        },
        // 表格 多选 事件
        onSelectionChange(selectedRows) {
            this.selectedRows = selectedRows;
            console.log(selectedRows)
        },
        del() {
            if (this.selectedRows.length > 0) {
                this.loading = true;
                this.$confirm('该删除后将不可恢复，是否删除？', '友情提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    cancelButtonClass: 'JmconfirmCancelButton',
                    type: 'warning'
                }).then(() => {
                    let ids = []
                    this.selectedRows.forEach(item => {
                        ids.push(item.id)
                    })
                    delete_hyxxk(ids.join(',')).then(result => {
                        this.loading = false;
                        if (result && result.code == 200) {
                            this.$message.success('删除成功');
                            this.getTableData();
                        } else {
                            this.$message.error('删除数据失败！');
                        }
                    })
                        .catch(error => {
                            this.loading = false;
                        })
                })

            } else {
                this.$message.error('请选择一条数据删除');
                return false;
            }
        },
        //待处理
        go(name, params) {
            this.$emit('changePage', name, params);
        },



    }
}
</script>

<style lang="scss" scoped>
.dashboard-container {
    height: 100%;
    width: 100%;
    background-color: #fff;
    padding: 8px;

    .btn {
        padding: 8px 8px 8px 0;
    }

    ::v-deep .undertxt {
        color: rgb(64, 158, 255);
        cursor: pointer;

        &:hover {
            text-decoration: underline;
        }
    }
    ::v-deep .undertxtBlue {
        color: #0000ff;
        cursor: pointer;
        text-decoration: underline;
        &:hover {
        }
    }
    ::v-deep .undertxtRed {
        color: rgb(217, 0, 27);
        cursor: pointer;

        &:hover {
            text-decoration: underline;
        }
    }
}
</style>
